import React from 'react'
import PropTypes from 'prop-types'
import { View, Text, StyleSheet } from 'react-native'
import { ScaleS, ScaleT } from 'src/utils/ScreenUtil'
import CustomImage from 'src/components/image/CustomImage'
import CustomBoxShadow from 'src/components/boxshadow/CustomBoxShadow'

export default function PrivilegeHorizontal (props) {
  return (
    <CustomBoxShadow style={styles.container}>
      <CustomImage style={styles.img} source={props.imgUri}/>
      <View style={styles.txtWrap} >
        <Text style={styles.title}>{props.title}</Text>
        <Text style={styles.value}>{props.value}</Text>
      </View>
    </CustomBoxShadow>
  )
}
PrivilegeHorizontal.propTypes = {
  style: PropTypes.object,
  imgUri: PropTypes.number,
  title: PropTypes.string,
  value: PropTypes.string
}
const styles = StyleSheet.create({
  container: {
    width: ScaleS(151),
    height: ScaleS(88),
    marginHorizontal: ScaleS(7),
    backgroundColor: '#FFFFFF',
    borderRadius: ScaleS(10),
    shadowRadius: ScaleS(40),
    shadowOpacity: 0.7,
    shadowColor: '#E5E6EA',
    shadowOffset: {
      width: 0,
      height: ScaleS(7)
    },
    flexDirection: 'row',
    alignItems: 'center'
  },
  img: {
    marginLeft: ScaleS(14)
  },
  txtWrap: {
    marginLeft: ScaleS(15),
    justifyContent: 'center'
  },
  title: {
    marginTop: ScaleS(8),
    fontSize: ScaleT(15),
    lineHeight: ScaleS(32),
    fontWeight: '500',
    color: '#444444'
  },
  value: {
    fontSize: ScaleT(13),
    lineHeight: ScaleS(17),
    fontWeight: '500',
    color: '#C59850'
  }
})
